<template>
  <view>
    <view class="recharge">
      <view class="recharge-box">
        <view>
          <view class="tips">
            <image
              class="icon-map-zhan"
              src="/static/images/icon-map-zhuang.png"
            ></image>
            充电桩编号:{{ device_code }}
          </view>
        </view>

        <view class="title">输入或者选择要充电的预付金额：</view>
        <view class="input-box">
          <input
            class="input"
            type="number"
            placeholder="请输入整数金额(单位元)"
            v-model="money"
          />
        </view>

        <view class="item-num">
          <view
            :class="money == 10 ? 'num1 checked' : 'num1'"
            data-amount="10"
            @tap="choose"
            >10元</view
          >
          <view
            :class="money == 20 ? 'num checked' : 'num default'"
            data-amount="20"
            @tap="choose"
            >20元</view
          >
          <view
            :class="money == 30 ? 'num checked' : 'num default'"
            data-amount="30"
            @tap="choose"
            >30元</view
          >
        </view>

        <view class="item-num">
          <view
            :class="money == 50 ? ' num1 checked' : 'num1 default'"
            data-amount="50"
            @tap="choose"
            >50元</view
          >
          <view
            :class="money == 100 ? ' num checked' : 'num default'"
            data-amount="100"
            @tap="choose"
            >100元</view
          >
          <view
            :class="money == 200 ? ' num checked' : 'num default'"
            data-amount="200"
            @tap="choose"
            >200元</view
          >
        </view>

        <view class="btn btn-primary btn-recharge" @tap="clickRecharge"
          >充电</view
        >
      </view>
    </view>
  </view>
</template>
<!-- <script module="filters" lang="wxs" src="@/pages/utils/filter.wxs"></script> -->
<script>
// import toast from '@/pages/components/toast/toast';
// import Toast from '@vant/weapp/toast/toast';
const app = getApp();
let Store = app.globalData.Store;
let Sign = app.globalData.Sign;
let Api = app.globalData.Api;
export default {
  components: {
    // toast
  },
  //输入框跳转而来 或者 扫码而来
  data() {
    return {
      gobugo: true,
      //检测用户未登录而扫码 跳转用户登录
      user_id: '',
      balance: 0,
      //如果已登录的用户，记录其钱包余额 判断预付金额
      money: '',
      //选择金额页面的第一个金额记忆点
      device_code: ''
    };
  },
  onLoad: function (options) {
    //获取设备信息以及定价策略
    this.judgeToData(options.device_code);
  },
  onShow: function () { },
  methods: {
    judgeToData: function (code) {
      console.log(code);
      //1 存储数据
      Store.setItem('device_code', code);
      // this.setData({
      this.device_code = code,
        this.balance = Store.getItem('balance')
      // });
      //2 判断用户是否登录
      let that = this;
      let user_id = Store.getItem('user_id');
      if (user_id) {
        // that.setData({
        that.user_id = user_id
        // });
      } else {
        if (that.gobugo) {
          // that.setData({
          that.gobugo = false
          // });
          setTimeout(function () {
            uni.redirectTo({
              url: '../sysLogin/sysLogin?pay_source=FROM_TID_OLD'
            });
          }, 1000);
        }
      }
    },

    clickRecharge() {
      let this_ = this;
      //刷新
      uni.showLoading({
        title: '加载中'
      });

      setTimeout(function () {
        uni.hideLoading();
      }, 2000);
      //1 获取最新的充电桩状态
      let device_code = this.device_code;
      if (device_code) {
        const signObject = {
          device_code
        };
        const signvalue = Sign.signutil(signObject);
        app.globalData
          .get(Api.getMachineInfo, {
            device_code,
            sign: signvalue
          })
          .then((res) => {
            console.log(res);
            let devStatus = res.machine.stat;
            if (devStatus == '1') {
              //判断金额
              if (this_.checkMoney(this_.money)) {
                console.log(2);
                uni.navigateTo({
                  url: '../tidOLDToPay/tidOLDToPay?user_id=' + Store.getItem('user_id') + '&device_code=' + this_.device_code + '&price=' + this_.money
                });
              } else {
                uni.showToast({
                  title: '请选择金额或输入整数金额!',
                  icon: 'none',
                  duration: 1500
                });
              }
            } else {
              //弹框
              uni.showModal({
                title: '',
                content: '充电桩' + this_.changeMachineTrueStatus(devStatus),
                success(res) {
                  if (res.confirm) {
                  } else if (res.cancel) {
                  }
                }
              });
            }
          })
          .catch((e) => {
            if (e.code == -1) {
              uni.showModal({
                title: '',
                content: '未查询到该充电桩',
                success(res) {
                  if (res.confirm) {
                  } else if (res.cancel) {
                  }
                }
              });
            }
          });
      }
    },

    changeMachineTrueStatus(devStatus) {
      if (devStatus == '0') {
        return '请插枪';
      }
      if (devStatus == '1') {
        return '连接中';
      }
      if (devStatus == '2') {
        return '充电中';
      }
      if (devStatus == '4') {
        return '故障';
      }
      if (devStatus == '-1') {
        return '离线';
      }
      return '状态异常';
    },

    checkMoney: function (money) {
      if (money != '' && money != null) {
        var moneyString = money.toString();
        if (moneyString.indexOf('.') == -1 && moneyString.indexOf('。') == -1) {
          return true;
        } else {
          return false;
        }
      } else {
        return false;
      }
    },

    //手动输入金额
    getMoney(e) {
      let amount = e.detail.value;
      // this.setData({
      this.money = amount
      // });
    },

    //点选按钮
    choose(e) {
      let data = e.currentTarget.dataset;
      // this.setData({
      this.money = data.amount
      // });
      //console.log(this.data.money);
    }
  }
};
</script>
<style>
@import "./tidOLDSelMoney.css";
</style>
